<%@page contentType="text/html" pageEncoding="UTF-8"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%>
<%@taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%
    String basePath = request.getContextPath();
%>
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>后台登录</title>
    <meta name="renderer" content="webkit|ie-comp|ie-stand">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <link href="<%=basePath%>/static/admin/css/bootstrap.min.css" rel="stylesheet" />
    <link href="<%=basePath%>/static/admin/font-awesome-4.7/css/font-awesome.css" rel="stylesheet" />

    <link href="<%=basePath%>/static/admin/js/plugins/layui-v2.1.5/css/layui.css" rel="stylesheet" media="all">
    <link href="<%=basePath%>/static/admin/css/animate.css" rel="stylesheet" />
    <link href="<%=basePath%>/static/admin/css/style.css" rel="stylesheet" />
    <link href="<%=basePath%>/static/admin/css/plugins/x-admin/xadmin.css" rel="stylesheet" />

    <!-- 图标 -->
    <link href="<%=basePath%>/static/main/assets/ico/monkey.ico" rel="shortcut icon" >

    <script type="text/javascript" src="<%=basePath%>/static/admin/js/jquery-2.1.1.js"></script>
    <!-- verifyCode -->
    <script type="text/javascript" src="<%=basePath%>/static/admin/js/plugins/geetest/gt.js"></script>
    <script type="text/javascript" src="<%=basePath%>/static/common/js/md5.js"></script>
    <!-- layui -->
    <script type="text/javascript" src="<%=basePath%>/static/admin/js/plugins/layui-v2.1.5/layui.all.js"></script>
    <script type="text/javascript" src="<%=basePath%>/static/common/js/utils.js"></script>
</head>
<body class="login-bg" style="z-index: 100;background-image:url(<%=basePath%>/static/admin/img/x-admin/bg.png);">

<div class="login animated fadeInDown">
    <div class="message">admin2.0-管理登录</div>
    <div id="darkbannerwrap" style="background: url(<%=basePath%>/static/admin/img/x-admin/aiwrap.png);"></div>
    <form role="form" id="login_from">
        <div class="form-group">
            <input type="text" class="form-control" name="username" id="username" placeholder="用户名" required="">
        </div>
        <div class="form-group">
            <input type="password" class="form-control" name="password" id="password" placeholder="密码"
                   required="" onfocus="this.select();" />
        </div>

        <div class="form-group">
            <div id="captcha-box"></div>
        </div>

        <a type="button" class="btn btn-primary m-b loginBtn" style="width: 100%;margin-top: 15px;"
           id="adminLoginBtn" data-url="/admin/index">
            <i class="fa fa-paw"></i>
            去Admin</a>
    </form>
</div>

<div class="spinner-bg"></div>

<script>
    $(function  () {
        var key = '${key}';
        //极验宽度设置
        var geetestWidth = $("#login_from").width();

        $(window).resize(function() {
            // 极验长度随form表单一致
            geetestWidth = $("#login_from").width();
            $("#captcha-box .geetest_holder").css("width",geetestWidth);
        });

        var geetestObj;
        // 极验注册
        initGeetest({
            product: 'popup',	// 分别是 popup（弹出式）、float（浮动式）、custom（与popup类似，但是可以自定义弹出区域）、bind（隐藏按钮类型）
            width: geetestWidth+'px',
            // 以下配置参数来自服务端 SDK
            gt: '${geetestData.geetest}',
            challenge: '${geetestData.challenge}',
            offline: ${geetestData.success eq 1? false:true},
            new_captcha: ${geetestData.new_captcha}
        }, function (captchaObj) {
            // 这里可以调用验证实例 captchaObj 的实例方法
            geetestObj = captchaObj;
            geetestObj.appendTo("#captcha-box");
        });

        // 提交按钮
        $('.loginBtn').on('click', function(ev) {
            if($(this).attr("disabled")) return false;
            $(this).attr("disabled",true);
            // 按钮重复点击
            if($(":focus").length != 0){
                $(":focus")[0].blur();
            }
            var geetestResult = geetestObj.getValidate();
            console.info(geetestResult);
            if(geetestObj == undefined || geetestResult == undefined
                || geetestResult == false){
                showSimpleTip("请先通过验证!");
                $(this).attr("disabled",false);
                return false;
            }
            var password = $("#password").val();
            if(password){
                $('#password').val(calcMD5(calcMD5(password)+key));
            }
            showLoading();

            // 阻止浏览器
            ev.stopPropagation();
            ev.preventDefault();
            var $$ = $('#login_from');
            var data = $$.serializeArray();
            var postData = {};
            var valid = false;
            $.each(data, function (n, v) {
                postData[data[n].name] = data[n].value;
                if(data[n].value === undefined || data[n].value === ""){
                    valid = true;

                }
            });
            if(valid == true){
                showSimpleTip("请将用户名和密码填写完整!");
                hideLoading();
                $(this).attr("disabled",false);
                return false;
            }
            data["geetest_challenge"] = geetestResult.geetest_challenge;
            data["geetest_validate"] = geetestResult.geetest_validate;
            data["geetest_seccode"] = geetestResult.geetest_seccode;

            $.ajax({
                type: "POST",
                url: '<%=basePath%>/system/user/verifyLogin',
                dataType: 'json',
                data: postData,
                success: function (result) {
                    console.info(result);
                    if (result["resultCode"] !== undefined) {
                        if(result["resultCode"] == 200){
                            window.location.href = "<%=basePath%>/"+ result["resultData"];
                        }else{
                            geetestObj.reset();
                            layer.msg(result.message);
                            $(".loginBtn").attr("disabled",false);
                        }
                    }
                    hideLoading();
                }
            });
        });

        // 定时刷新
        setInterval(function(){
            window.location.reload();
        }, 1000*60*20);

    });


</script>
<style type="text/css">
    .geetest_holder.geetest_wind{
        min-width: 0px;
    }
    .geetest_logo,.geetest_success_logo{
        display: none;
    }
</style>
</body>
</html>